<template>
	<div class="front">
		<el-table :data="tableData" border highlight-current-row>
			<el-table-column type="selection" width="80" align="center"></el-table-column>
	        <el-table-column type="index" label="序号" width="70" align="center"></el-table-column>
	        <el-table-column property="name" label="名称" min-width="150" align="center"></el-table-column>
	        <el-table-column property="locks" label="是否可用" min-width="80" align="center">
	            <template slot-scope="scope">
	                <span>{{ scope.row.locks == 1 ? '是' : '否' }}</span>
	            </template>
	        </el-table-column>
		</el-table>
	</div>
</template>
<script>
export default {
	data() {
		return {
			tableData: []
		}
	},
	methods: {
		getCountryData() {
			this.$store.commit('cityDictionaryStore/updateLoading', true);
			this.$http.get('city/findCountry').then(res => {
				if(res.data.code == 20001) {
					this.$store.commit('cityDictionaryStore/updateLoading', false);
					if(res.data.data) {
						this.tableData = res.data.data;
						this.$store.commit('cityDictionaryStore/updateCountryData', res.data.data);
					}
				} else {
					this.$store.commit('cityDictionaryStore/updateLoading', false);
				}
			});
		}
	},
	created() {
		this.getCountryData();
	}
}
</script>